<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<c:set var="path" value="${pageContext.request.contextPath }" />
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

<title>Geek 项目管理客户端</title>
<script type="text/javascript"
	src="${path }/resource/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript"
	src="${path }/resource/js/systools/MBase.js"></script>



<!--[if lt IE 8]>
    <meta http-equiv="refresh" content="0;ie.html" />
    <![endif]-->
<script>
	if (window.top !== window.self) {
		window.top.location = window.location
	};
</script>
<style type="text/css">
	html{
		height:100%;
		width:100%;
	}
	body.signin{
		height:100%;
		width:100%;
		background:radial-gradient(ellipse at 50% 50%,#00a38d 0,#1e5899 100%,#efefef); 
		overflow-x: hidden;
	}
	.bg-img{
		position:relative;
		width:100%;
		height:100%;
		background:url(${path }/resource/images/stars.png)
	}
	.top-title{
		position:fixed;
		background:rgba(0,57,81,.62);
		top:0;
		width:100%;
		font-size:30px;
		color:#fff;
		line-height:40px;
		text-align:center;
		height: 40px;
    	box-shadow: 0 2px 6px 2px #0C3D68;
	}
	.foot-title{
		position:fixed;
		background:rgba(0,57,81,.62);
		bottom:0;
		width:100%;
		font-size:10px;	
		color:#fff;
		line-height:30px;
		text-align:center;
		
	}
	.content{
		position: absolute;
	    width: 100%;
	    height: 100%;
	}
	
	.content .login{
		
		height:200px;
	    color:#fff;
	    position: absolute;
	    text-align: center;
	    margin:auto;
	    top: 0;
	    bottom: 0;
	    right: 0;
	    left: 0;
	}
	.content .login p{
		font-size:40px;
	}
	.login input{
		line-height:2em;
		
		padding:5px;
		margin:20px 20px 0 20px;		
		background: none;
	    border: none;
	    
	    text-align:center;
	    width: 200px;
	}
	.login input:focus{
		background:  rgba(255, 255, 255, 0.5);
		border-radius:5px;
		text-align:left;
	}
	.login button:hover{
		background: linear-gradient(to left,rgba(113, 169, 196, 0.2),#5cc9cf,rgba(113, 169, 196, 0));
		height: 45px;
		width: 45px;
		font-size:16px;
	
	}
	.login button{
		 border-radius: 50%;
		 height: 40px;
		 width: 40px;
		 color:#fff;			 
		 border: none;
		 background: none;  
		 margin-top:20px;		 
		 transition:all 0.5s;
	}
	.login>div{
		    height: 4px;
		    background: linear-gradient(to left,rgba(113, 169, 196, 0.2),#5cc9cf,rgba(113, 169, 196, 0));
		    width: 200px;
		    margin: auto
	}
	 
	  input:-ms-input-placeholder{
	   color:#fff;
	}
	
	input::-webkit-input-placeholder{
	   color:#fff;
	} 
</style>
</head>
 
<body class="signin" onkeypress="dologin(event)">
	<div class="bg-img">
		<div class="top-title">GeeK 项目管理客户端</div>
		
		<div class="content">
			<form action="" autocomplete="off">
			<div class="login">
				<p></p>
				<input type="text" placeholder="账号" id="account">
				<div class="line"></div>
				<input type="password" placeholder="密码" id="password">
				<div class="line"></div>
				<button type="button" onclick="login()">
					go
				 </button>
			
			</div>
			</form>	
		</div>
		<div class="foot-title">
			<div class="text-center">&copy; 2016 All Rights Reserved.
				ZkingMatrix</div>
		</div>
	</div>
	
</body>
<script type="text/javascript">
	function login() {
		if ($("#account").val() == "") {
			layer.tips('请输入账号！', '#account');
			return false;
		} else if ($("#password").val() == "") {
			layer.tips('请输入密码！', '#password'); 	
			return false;
		}
		console.log($("#password").val());

		$.AjaxProxy({
			a : false,
			c : false,
			p : {
				account : $("#account").val(),
				password : $("#password").val()
			}
		}).invoke("${path}/common/clientLogin", function(loj) {
			MTools.redirect("${path}/" + loj.getValue("page"));
		});
	}
	function dologin(e) {
		if (e.keyCode == 13) {
			e.preventDefault();
			window.event.returnValue = false;
			login();
			return false;
		}
	}
</script>
</html>